<template>
	<view class="conter">
		<view @click="public" class="guanli_box">
			<view class="guaunl">团员管理</view>
			<view class="parsing">进入</view>
		</view>
		<view @click="application" class="guanli_box">
			<view class="guaunl">申请管理</view>
			<view class="parsing">进入</view>
		</view>
		<view @click="public" class="guanli_box">
			<view class="guaunl">团公告编辑</view>
			<view class="parsing">进入</view>
		</view>
		<view @click="public" class="guanli_box">
			<view class="guaunl">天团设置</view>
			<view class="parsing">进入</view>
		</view>
		<view @click="public" class="guanli_box">
			<view class="guaunl">天团手册</view>
			<view class="parsing">进入</view>
		</view>
		<view class="guanli_box">
			<view class="guaunl">天团升级</view>
			<view @click="show = true" class="parsing">进入</view>
		</view>
		<u-popup bgColor="#1A1A1A" round="14" :show="show" mode="center" @close="close">
			<view class="clost_box">
				<view class="title">温馨提示</view>
				<view class="price">您确定要消耗888个金豆升级天团吗？</view>
				<view class="button_box">
					<view @click="show = false" class="buttone">取消</view>
					<view class="buttone" @click="confirmUpgradeGuild" style="background-color: #eef862; color: #000">确定</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
import config from '@/config.js';
import { toast, showConfirm, tansParams } from '@/utils/common';
import { judgeGuildUpgrade } from '@/api/union/union.js';
export default {
	data() {
		return {
			show: false,
			imgUrl: config.gillUrl
		};
	},
	onLoad(option) {
		this.guildId = option.guildId;
	},
	methods: {
		public() {
			this.$modal.showToast('暂未开放');
		},
		cancel() {
			this.show = false;
		},
		upgrade() {
			this.show = true;
		},
		async confirmUpgradeGuild() {
			const data = await judgeGuildUpgrade();
			if (data.code == 200) {
				this.show = false;
				this.$modal.showToast('天团升级成功');
			} else {
				this.show = false;
				this.$modal.showToast(data.msg);
			}
		},
		application() {
			uni.navigateTo({
				url: `/pages/tiantuan/application?guildId=${this.guildId}`
			});
		}
	}
};
</script>

<style scoped lang="less">
page {
	background-color: #1a1a1a;
}

.conter {
	padding: 30rpx 34.88rpx;
	.clost_box {
		width: 645rpx;
		height: 420rpx;
		background: #1a1a1a;
		border-radius: 35rpx;
		border: 3rpx solid #acacac;
		.title {
			color: #ffffff;
			font-size: 45rpx;
			font-weight: 400;
			margin-top: 41rpx;
			text-align: center;
			margin-bottom: 66.28rpx;
			font-family: 'zcoolqingkehuangyouti, zcoolqingkehuangyouti';
		}
		.price {
			font-size: 31rpx;
			font-weight: 500;
			color: #ffffff;
			margin-top: 62rpx;
			text-align: center;
		}
		.button_box {
			display: flex;
			padding: 80rpx 36rpx 0 36rpx;
			justify-content: space-between;
			.buttone {
				width: 227rpx;
				height: 77rpx;
				text-align: center;
				line-height: 82rpx;
				background: #ff5359;
				border-radius: 17rpx;
				font-size: 31rpx;
				font-family: 'font';
				font-weight: 700;
				color: #ffffff;
			}
		}
		.button_boxpo {
			display: flex;
			padding: 10rpx 36rpx 0 36rpx;
			justify-content: space-between;
			.buttone {
				width: 227rpx;
				height: 77rpx;
				text-align: center;
				line-height: 82rpx;
				background: #ff5359;
				border-radius: 17rpx;
				font-size: 31rpx;
				font-family: 'font';
				font-weight: 700;
				color: #ffffff;
			}
		}
	}

	.guanli_box {
		display: flex;
		width: 680rpx;
		height: 117rpx;
		align-items: center;
		background: #1b1b1b;
		margin-bottom: 25rpx;
		border-radius: 38rpx;
		padding: 0 20rpx 0 34.88rpx;
		border: 2rpx solid #2f2f2f;
		justify-content: space-between;

		.guaunl {
			font-size: 35rpx;
			font-weight: 400;
			color: #ffffff;
			line-height: 42rpx;
			font-family: 'zcoolqingkehuangyouti, zcoolqingkehuangyouti';
		}

		.parsing {
			width: 143rpx;
			height: 75rpx;
			color: #353535;
			font-size: 28rpx;
			font-weight: 700;
			line-height:80rpx;
			text-align: center;
			background: #eef862;
			border-radius: 38rpx;
		}
	}
}
</style>
